<template>
  <div>
    <Card>
      <!-- <div slot="title">
        <div class="edit-head">
          <a @click="Contrgo" class="back-title">
            <Icon type="ios-arrow-back" />
          </a>
        </div>
      </div> -->
      <div class="edit-head">
        <span
          @click="Contrgo"
          class="back-title"
          style="18px;margin-left:17px;cursor:pointer;"
        >
          <Icon style="font-size: 20px" type="ios-arrow-back" />
        </span>
      </div>
      <div class="searchs">
        <h3 class="Ruleist-contr">规则列表</h3>
        <div class="rulesss" v-for="item in ruleList" :key="item">
          <div class="ruleListitem" @click="Rulest(item)">
            《{{ item.title }}》
          </div>
          <p></p>
        </div>
      </div>
      <!-- 弹框 -->
      <Modal
        class="RuleLis"
        v-model="Ruleimod"
        :title="Ruletitle"
        width="50%"
        height="500"
      >
        <iframe
          style="border: 0"
          :src="this.htmls"
          height="540"
          width="100%"
          name="demo"
          scrolling="auto"
          sandbox="allow-same-origin"
        ></iframe>
        <div slot="footer">
          <Button @click="Ruleimod = false">取消</Button>
          <Button type="primary" @click="Ruleimod = false">确定</Button>
        </div>
      </Modal>
    </Card>
  </div>
</template>

<script>
import { getPlatformRulesList, getPlatformRulesId } from "@/api/index";
import { getStore } from "@/libs/storage";
export default {
  data() {
    return {
      Ruletitle: "",
      Ruleimod: false,
      searchForm: {
        pageNumber: 1, // 当前页数
        pageSize: 10, // 页面大小
        sort: "createTime", // 默认排序字段
        order: "desc", // 默认排序方式
      },
      ruleList: [],
      header: {
        "content-type": "multipart/form-data",
        accessToken: getStore("accessToken"),
      },
      accessToken: getStore("accessToken"),
      htmls: "",
    };
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.getDataList();
    },
    Contrgo() {
      this.$router.go(-1);
    },
    getDataList() {
      this.searchForm.userId = this.userId;
      getPlatformRulesList(this.searchForm).then((res) => {
        if (res.code == 200) {
          if (res.result.length > 0) {
            this.ruleList = res.result;
          } else {
            this.ruleList = [];
          }
          this.bus.$emit("loading", false);
        } else {
        }
      });
    },
    // 点击
    Rulest(row) {
      this.ruleList.forEach((item) => {
        if (item.id == row.id) {
          this.Ruletitle = "《" + item.title + "》";
            this.htmls =  `http://47.92.248.46:8089` + item.rulesPath;
         
        }
      });
      this.Ruleimod = true;
      getPlatformRulesId({ id: row.id }).then((res) => {});
    },
  },
};
</script>

<style lang="less">
.box {
  width: 100%;
  height: 730px;
}
.provisions {
  display: flex;
  // justify-content
}
.ruleListitem {
  display: inline-block;
  line-height: 58px;
  cursor: pointer;
  font-size: 15px;
}
.but {
  display: flex;
}
.rulesss {
  width: 100%;
  border-bottom: 1px solid #dedede;
  span {
    color: #39394d;
    text-decoration: none;
    display: inline-block;
    line-height: 38px;
    font-size: 14px;
  }
}
.box {
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.searchs {
  padding: 0px 14px;
  width: 100%;
  height: 49rem !important;
  overflow: auto;
}
.Ruleist-contr {
  margin-top: 15px;
  font-size: 20px;
  color: #39394d;
  margin-left: 6px;
}
.RuleLis {
  .ivu-modal-header-inner {
    font-size: 16px;
    height: 32px;
    line-height: 32px;
    font-weight: 700;
  }
  .ivu-modal-content {
    .ivu-modal-header {
      border: 0;
    }
  }
  .ivu-modal-footer {
    border: 0;
  }
  .ivu-modal-body {
    padding: 0 30px;
  }
}
</style>